<template>
	<div id="decorationNew" class="wrap_common decoration-new">
		<div class="wrap_common_sub">
			<!-- 搜索块 -->
			<!--div class="search_wrap">
				<div class="search_wrap_body">
						<div class="search_wrap_content">
								<section class="search_wrap_input">
									<div class="search_wrap_input_left">
										<div class="input_price_left" @click.stop="selectAddr">
											<span class="ellipsis_line_com">{{ areaSelData.cityName }}</span>
											<i class="icon iconfont iconxiala"></i>
										</div>
										<span class="search_wrap_separate">|</span>
										<v-getPhoneNumber @cbFn="getPhoneNumber" dataSource="智能报价">
											<div class="input_price_right flex flex-align-center">
												<a href class></a>
												<i class="icon iconfont iconjisuanji"></i>
												<span>10s{{ constant.oemObj.promptText }}报价</span>
											</div>
										</v-getPhoneNumber>
									</div>
									<v-getPhoneNumber @cbFn="getPhoneNumber" class="search_wrap_phone" dataSource="智能报价">
										<div class="search_wrap_input_right flex flex-align-center">
											<span>去估算</span>
											<i class="icon iconfont iconjiantou"></i>
										</div>
									</v-getPhoneNumber>
								</section>
							<div class="search_message" @click="toChat()">
								<i class="icon iconfont iconxiaoxi"></i>
							</div>
						</div>
					<div class="search_mask"></div>
				</div>
			</div-->
			<!-- 轮播快 -->
			<div class="swipe_wrap">
				<swiper class="swiper" :indicator-dots="true" :interval="3000" indicator-color="white" indicator-active-color="#ffd11a">
					<swiper-item v-for="(item, index) in bannerData" :key="index" class="promotion_body"
					@click="jumpMenuFn(item)">
						<div class="swipe_list">
							<img :src="`${constant.imgUrl}${item.img_url}`" alt="轮播图" mode="scaleToFill" />
						</div>
					</swiper-item>
				</swiper>
				<!-- <div class="swipe_label_wrap" v-if="userInfo.shop_tag_info.length > 0">
                    <div v-for="item in userInfo.shop_tag_info" :key="item.id">
                        <van-icon name="passed" />
                        <span>{{ item.tag_name }}</span>
                    </div>
                </div> -->
			</div>
			<div class="module_com_wrap">
				<!-- tab栏 -->
				<!--
				<div class="tab_wrap">
					<div class="tab_list" v-for="(item,index) in menuList" :key="item.name">
						<v-getPhoneNumber v-if="item.btnType == 'active'" class="otherDiv" @cbFn="getPhoneNumber" :itemIndex="index" :dataSource="item.name">
							<template>-->
								<!-- otherimg -->
								<!--<div class="tab_img ">
									<img :src="`${constant.imgUrl}${item.img}`" alt/>
								</div>
								<span>{{ item.name }}</span>
							</template>
						</v-getPhoneNumber>

						<div v-else class="otherDiv" @click="jumpMenuFn(item)">
							<div class="tab_img">
								<img :src="`${constant.imgUrl}${item.img}`" alt/>
							</div>
							<span>{{ item.name }}</span>
						</div>
					</div>
				</div>-->
				<!-- ad块 -->
				<div class="ad_wrap" v-if="this.$util.shieldReview()">
					<div class="ad_list">
						<v-getPhoneNumber class="ad_img getPhoneBtn" @cbFn="getPhoneNumber" dataSource="fenshui">
							<image :src="constant.imgUrl + 'design/company/icon_ad_1.png'" alt mode="widthFix"></image>
						</v-getPhoneNumber>
						<div class="ad_img" v-for="(item,index) in adBtnList" :key="item.url"
							 @click="jumpMenuFn(item)">
							<image :src="`${constant.imgUrl}${item.img}`" alt mode="widthFix"></image>
						</div>
					</div>
				</div>
				<!-- 促销活动 -->
				<div class="active_wrap" v-if="promotionList.length > 0">
					<app-promotions ref="appPromotions" :dataList="promotionList"></app-promotions>
				</div>
			</div>
			<!-- 今日推荐 -->
			<div class="module_com_wrap today_recommend_wrap">
				<!-- <van-tabs v-model="recommendTabActive" color="#ffd11a" :line-width="30"
					v-if="todayRecData.length > 0"
					class="wrap_top" animated>
					<van-tab title="今日推荐"> -->
				<div class="title_wrap">今日推荐</div>
				<div class="recommend_wrap">
					<template v-for="(item,index) in todayRecData">
						<div class="update_com_content" @click="jumpNewestDetFn(item)" :key="index">
							<div class="update_con_img">
								<img :src="`${item.type == 1 ? item.image_url : item.cover_img}?x-oss-process=image/resize,m_fill,h_480,w_1065`" :lazy-load="true" mode="aspectFill" alt="文章图片"/>
								<!-- <img :src="item.type == 1 ? item.image_url : item.cover_img" alt="文章图片" /> -->
							</div>
							<div class="update_con_wrap">
								<div class="update_con_title ellipsis_two_line_com">{{ item.type == 1 ? item.case_name :
									item.title }}
								</div>
								<div class="update_con_house" v-if="item.type == 1">
									<span>{{ item.acreage }} | {{ item.room }} </span>
									<!-- <span>| {{ item.price }}</span>
									<span class="singOn-tag" v-if="item.gift_price">预约最高可享￥{{ item.gift_price | toFix }}万</span>-->
									<span class="singOn-tag" v-if="item.gift_price"></span>
									<span class="singOn-tag" v-else>线上预约享专属大礼包</span>
								</div>
								<div class="update_con_info case_share_info" v-if="item.type == 1">
									<div v-if="item.share_num">{{ item.share_num }}人分享</div>
									<div v-if="item.share_num">|</div>
									<!-- TODO data为保留属性名，需更换 -->
									<!-- app-user-attr style="margin-right: 6px" v-if="item.share_user_list.length > 0" :maxLength="6"
												   :attrData="item.share_user_list"></！app-user-attr>-->
									<div v-if="item.view_num">{{ item.view_num }}位业主关注</div>
								</div>
								<div class="update_con_info article_share_info" v-else>
									<div class="flex flex-align-center">
										<!-- TODO data为保留属性名，需更换 -->
										<!-- app-user-attr style="margin-right: 6px" v-if="item.share_user_list.length > 0" :maxLength="6"
													   :attrData="item.share_user_list"></!-->
										<div v-if="item.view_num">{{ item.view_num }}浏览</div>
									</div>
									<div class="flex flex-align-center" v-if="item.share_num">
										<i class="iconfont iconfenxiang" style="margin-right: 6px"></i>
										<span>{{ item.share_num }}</span>
									</div>
								</div>
								<!-- <div class="update_com_btn">
									<div class="update_btn_com" v-if="$_isShow(owner_user_id)"
										 @click.stop="toMaterialList(item, item.type == 1 ? 2 : 1)">朋友圈推广
									</div>
									<div class="update_btn_com" v-if="$_isShow(owner_user_id)"
										 @click.stop="pushTeam(item, item.type == 1 ? 2 : 1)">推给团队
									</div>
									<div class="update_btn_com share_btn" v-if="$_isShow(owner_user_id)"
										 @click.stop="shareGuestBtn(item)">
										<i class="iconfont iconfenxiang"></i>
										<span class>推广获客</span>
									</div>
								</div> -->
							</div>
						</div>
					</template>
				</div>
				<!-- </van-tab> -->
				<!-- <van-tab title="装修方案">暂无</van-tab>
                    <van-tab title="装修攻略">暂无</van-tab>-->
				<!-- </van-tabs> -->
			</div>
			<!-- 附近工地 -->
			<!-- <div class="module_com_wrap site_wrap" v-if="userInfo.role_id === 1 && userInfo.BuildingSite.list.length > 0">
				<div class="title_wrap">附近工地</div>
				<div class="content_wrap">
					<app-site-map ref="appSiteMap" @visitCall="visitCall"></app-site-map>
				</div>
			</div> -->
			<!-- 合作品牌 -->
<!-- 			<div class="module_com_wrap cooperation_wrap">
				<div class="title_wrap">合作品牌</div>
				<div class="content_wrap">
					<img :src="constant.imgUrl + 'design/company/icon_brands.png'" alt/>
				</div>
			</div> -->
			<!-- 用户信息 -->
			<div class="module_com_wrap user_wrap">
				<div class="user_wrap_top">
					<div class="user_attr">
						<img :src="`${userInfo.user_picture}?x-oss-process=image/resize,m_fill,h_210,w_210`" alt/>
					</div>
					<div class="user_name_wrap">
						<div class="user_name ellipsis_line_com">{{ userInfo.nick_name }}</div>
						<div class="star_wrap">
							<div class="star_list">
								<image class="star_list_img" v-for="(item, index) in 5" :key="index" :src="constant.imgUrl+'design/company/icon_Stars.png'" alt/>
							</div>
							<div class="people_num">
								<span>已有</span>
								<span class="highlight_text">{{ totalVistor }}</span>
								<span>人预约</span>
							</div>
						</div>
					</div>
				</div>
				<div class="user_wrap_bottom">
					<p class="ellipsis_two_line_com">地 址：{{ userInfo.full_address || '暂无' }}</p>
					<p>营业时间：{{ userInfo.business_hours || '暂无' }}</p>
				</div>
			</div>
		</div>
		<!-- 组件 -start -->
		<footer>
			<v-normalFooter :isShowAttr="true" ref="normalFooter"></v-normalFooter>
			<!-- <v-normalFooter v-if="!$_isShow(owner_user_id)" :isShowAttr="true" ref="normalFooter"></v-normalFooter> -->
		</footer>
		<v-mapNav ref="mapNav"></v-mapNav>
        <!-- <v-appointvist ref="visit"></v-appointvist> -->
		<!-- <v-guide v-if="$_isShow(owner_user_id)" :userInfo="userInfo"></v-guide> -->
		<get-phone-pup ref="getPhonePup" :userInfo="userInfo" />
		<!-- 领取优惠 -->
		<app-coupon-pup ref="appCouponPup"></app-coupon-pup>
		<!-- 分享弹窗 -->
		<v-sharePoster ref="sharePoster" :type="btnType"></v-sharePoster>
		<!-- 地区选择 -->
		<!-- <v-city-select :value="areaSelData.isMask" :columnsNum="2" @confirm="getSelCityName" @cancel="areaSelData.isMask = false"></v-city-select> -->
        <mpvue-city-picker themeColor="#FFD11A" ref="mpvueCityPicker" :pickerValueDefault="areaSelData.defaultArea"
		 @onConfirm="getSelCityName"></mpvue-city-picker>
	</div>
</template>
<script>
import { mapGetters, mapState, mapActions } from 'vuex'
import getPhoneNumber from '@/pages/components/getPhoneNumber'
import NormalFooter from '@/pages/components/normalFooter'
// import Coupon from '@/components/Public/Coupon'
import MapNav from '@/pages/components/mapNav'
import getPhonePup from '@/pages/components/getPhonePup'
// import Guide from '@/pages/components/guide'
import AppPromotions from '@/pages/components/appPromotions'
// import AppSiteMap from '@/pages/components/appSiteMap'
// import AppointVisit from '@/components/Public/AppointVisit'
import AppUserAttr from '@/pages/components/appUserAttr'
import AppCouponPup from '@/pages/components/appCouponPup'
import SharePoster from '@/pages/components/sharePoster'
// import CitySelect from '@/components/Public/citySelect'
import mpvueCityPicker from '@/components/mpvue-citypicker/mpvueCityPicker'
import { jumpShop, isWxMiniapp, jumpToChat } from '@/utils/common'
// api
import { getlist as getPromotionList } from '@/api/promotion'
import { getAdvert } from '@/api/decoration'
import { getUserInfo } from '@/api/login'
import { getBasicUser } from '@/utils/auth.js'
import qs from 'qs'
// import { constants } from 'crypto'
export default {
	name: 'DecorationNew',
	components: {
		'v-getPhoneNumber': getPhoneNumber,
		'v-normalFooter': NormalFooter,
		// 'v-coupon': Coupon,
		'v-mapNav': MapNav,
		// 'v-appointvist': AppointVisit,
		// 'v-guide': Guide,
		'v-sharePoster': SharePoster,
		AppPromotions,
		// AppSiteMap,
		AppUserAttr,
		AppCouponPup,
		getPhonePup,
		mpvueCityPicker
		// 'v-city-select': CitySelect
	},
	filters: {
		toFix(val) {
			val = Number(val) / 10000
			return Number(val).toFixed(1)
		}
	},
	data() {
		return {
			constant: this.$constant,
			// imgUrl: this.constant.imgUrl,
			owner_user_id: '',
			share_user_id: '',
			btnType: null,
			isWxMiniBro: true,
			// adIcon1: this.constant.imgUrl + 'design/company/icon_ad_1.png',
			// 今日推荐
			recommendTabActive: 0,
			todayRecData: [],
			bannerData: [
				{
					img_url: 'design/freemodule/icon_calcular.png',
					url: '/pages/pagesHome/thematicmo/inteoffer',
					query: () => {
						return {
							intotype: 'normal',
							user_name: this.userInfo.nick_name,
							share_user_id: this.share_user_id
						}
					}
				},
				{
					img_url: 'design/company/banner_1.png',
					url: '/pages/pagesHome/active/houseDesign',
					query: () => {
						return {
							user_name: this.userInfo.nick_name,
							share_user_id: this.share_user_id
						}
					}
				}
			],
			mobile: '',
			// tab按钮块
			menuList: [
				{
					img: 'design/company/icon_inteprice.png',
					name: '智能报价',
					url: '/pages/pagesHome/thematicmo/inteoffer',
					btnType: 'active',
					query: () => {
						return {
							intotype: 'normal',
							user_name: this.userInfo.nick_name,
							share_user_id: this.share_user_id
						}
					}
				},
				{
					img: 'design/company/icon_homedesian.png',
					name: '户型设计',
					url: '/pages/pagesHome/active/houseDesign',
					btnType: 'active',
					query: () => {
						return {
							user_name: this.userInfo.nick_name,
							share_user_id: this.share_user_id
						}
					}
				},
				{
					img: 'design/company/icon_introduce.png',
					name: '企业介绍',
					url: '/pages/company/introduce',
					query: () => {
						return {
							owner_user_id: this.owner_user_id
						}
					}
				},
				{
					img: 'design/company/icon_red_envelope.png',
					name: this.$constant.oemSource == 3 ? '家具红包' : '装修红包',
					btnType: 'active',
					function: () => {
						this.$refs.appCouponPup.showMask()
					}
				},
				{
					img: 'design/company/icon_myteam.png',
					name: '我的团队',
					url: '/pages/admin/league/leagueTeamList',
					query: () => {
						return {
							usertypes: 'user_company'
						}
					}
				}
			],
			// ad广告块
			adBtnList: [
				{
					// 装修直播
					img: this.$constant.oemSource == 3 ? 'design/company/icon_ad_2_wj.png' : 'design/company/icon_ad_2.png',
					url: '/pages/pagesHome/shop/shopLivingList'
				},
				{
					// 案例列表
					img: 'design/company/icon_ad_3.png',
					url: '/pages/case/caselist',
					query: () => {
						return {
							owner_user_id: this.owner_user_id,
							share_user_id: this.owner_user_id,
							p_share_user_id: this.share_user_id
						}
					}
				},
				{
					// 文章列表
					img: 'design/company/icon_ad_4.png',
					url: '/pages/pagesHome/shop/shopArticle',
					query: () => {
						return {
							owner_user_id: this.owner_user_id,
							share_user_id: this.owner_user_id,
							p_share_user_id: this.share_user_id
						}
					}
				}
			],
			// 促销活动
			promotionList: [],
			// 地区选择
			areaSelData: {
				cityName: '厦门市',
				isMask: false,
				defaultArea: [0, 0, 1]
			},
			totalVistor: 0
		}
	},
	computed: {
		...mapGetters({ userInfo: 'getBasicUser' }),
		...mapState({
			loginInfo: state => state.login.loginInfo
		})
	},
	onLoad(options) {
		this.options = options
	},
	onShow() {
		this.options = getCurrentPages()[0].options

		this.owner_user_id = this.options.owner_user_id
		this.share_user_id = this.options.share_user_id
		getBasicUser(this.owner_user_id).then(res => {
			this.init()

			uni.setNavigationBarTitle({
      			title: res.nick_name
			})

			this.$refs.mapNav.init(res)
			this.$refs.getPhonePup.init()

			// if (!this.$_isShow(this.owner_user_id)) {
			// 	this.$refs.normalFooter.init()
			// }
			this.totalVistor = res.count_data.totalVistor
		})
	},

	mounted() {
		// console.log('hhhhhh', this.$store.getters.getBasicUser)
		// getBasicUser(this.owner_user_id, true)
		// console.log('userInfo', this.userInfo)
	},
	methods: {
		init() {
			// isWxMiniapp().then(res => {
			// 	this.isWxMiniBro = res
			// })

			// setTimeout(() => {
			//     this.shareweixin()
			// }, 2000)

			this.areaSelData.cityName = this.getSelCityName()

			this._getPromotionList()
			this._getAdvert()
		},
		...mapActions([
			'setAuthorization'
		]),
		// 今日推荐
		_getAdvert() {
			uni.showLoading({
  				title: '',
  				mask: true
  			})
			const params = {
				store_id: this.userInfo.user_id
			}
			getAdvert(params).then(res => {
				uni.hideLoading()
				this.todayRecData = res.data
			})
		},
		// 促销列表
		_getPromotionList() {
			const params = {
				page: 1,
				limit: 3,
				owner_user_id: this.owner_user_id
			}
			console.log(params)
			getPromotionList(params).then(res => {
				this.promotionList = res.data.list
			})
		},
		/**
             * 功能按钮跳转相应的页面
             * @parmas item.type 1 为自身的跳转，2为商城的跳转, 3为商城带id的跳转
             */
		jumpMenuFn(item) {
			if (item.function) {
				item.function()
			}
			if (item.type == 2) {
				// this.jumpToWebview(item.url, { user_picture: this.userInfo.user_picture })
				return false
			}
			if (item.type == 3) {
				// this.jumpToWebview(item.url, { user_id: this.userInfo.user_id, user_picture: this.userInfo.user_picture })
				return false
			}
			if (item.url == 'ShopLiving') {
				uni.navigateTo({
					url: `/pages/pagesHome/shop/shopLivingList`
				})
				return
			}
			if (item.url) {
				let gotoUrl = item.url
				switch (item.url) {
					case 'ShopLiving':
						gotoUrl = '/company/center/shop/living'
						break
					case 'ShopCase':
						gotoUrl = '/company/case'
						break
					case 'ShopArticle':
						gotoUrl = '/company/article'
						break
				}
				let currentQuery = {}
				if (item.query) {
					currentQuery = item.query()
				}
				const returnUrl = `${this.commonJS.queryData({
					owner_user_id: this.userInfo.user_id,
					...currentQuery
				})}`
				const allQuery = returnUrl || `?owner_user_id=${this.userInfo.user_id}`
				uni.navigateTo({
					url: `${item.url}${allQuery}`
					// url: `/pages/page/webview/index?user_id=${this.userInfo.user_id}&returnUrl=${encodeURIComponent(`${this.constant.formal}/hkds/#${returnUrl}`)}`
				})
			}
		},
		jumpToWebview(url, params) {
			const returnUrl = encodeURIComponent(`${this.$constant.formal}/hkds/#${url}?${qs.stringify(params)}`)
			uni.navigateTo({
				url: `/pages/page/webview/index?user_id=${this.user_id}&returnUrl=${returnUrl}`
			})
		},
		// 联系我们
		toChat() {
			jumpToChat()
		},
		// 预约参观
		visitCall() {
			this.$refs.visit.showorder = true
		},
		// 跳转链接
		jumpHrefFn() {
		},
		// 跳转页面
		jumpPageFn() {
		},
		// 推广获客按钮
		shareGuestBtn(item) {
			this.btnType = item.type == 1 ? 2 : 3
			const id = item.type == 1 ? item.case_id : item.article_id
			const relevance_id = item.type == 1 ? item.case_relevance_id : item.article_relevance_id
			const data = {
				url: true,
				id: id,
				relevance_id: relevance_id
			}
			setTimeout(() => {
				this.$refs.sharePoster.showMask(data, true)
			}, 50)
		},
		/**
             * 跳转到今日推荐详情
             * @parmas item 数据列表
             */
		jumpNewestDetFn(item) {
			// const path = item.type == 1 ? '/hkds/#/company/case/detail' : '/hkds/#/company/article/detail'
			const path = item.type == 1 ? '/pages/case/casedetail' : '/pages/getGuest/articledetail'
			const query = {
				owner_user_id: this.userInfo.user_id,
				gobackt: ''
			}
			if (item.type == 1) {
				query.caseid = item.case_relevance_id
				query.mainId = item.case_id
			} else {
				query.articleid = item.article_relevance_id
				query.mainId = item.article_id
			}

			console.log(this.commonJS.queryData(query))
			uni.navigateTo({
				url: `${path}${this.commonJS.queryData(query)}`
			})
			// const returnUrl = encodeURIComponent(`${this.$constant.formal}${path}?${qs.stringify(query)}`)
			// uni.navigateTo({
			// 	url: `/pages/page/webview/index?user_id=${this.userInfo.user_id}&returnUrl=${returnUrl}`
			// })
		},
		// 推给团队
		pushTeam(data, type) {
			const params = {
				id: type === 2 ? data.case_relevance_id : data.article_relevance_id,
				imgUrl: type === 2 ? data.image_url : data.cover_img,
				title: type == 2 ? data.case_name : data.title,
				extension_num: data.extension_num,
				huoke_num: data.huoke_num,
				cat_name: type === 2 ? '' : data.cat_name,
				type: type === 2 ? 2 : 1,
				owner_user_id: this.owner_user_id,
				share_user_id: this.share_user_id,
				from: 'index'
			}
			// const returnUrl = encodeURIComponent(`${this.$constant.formal}/hkds/#/admin/guest/GeneralizeIteam?${qs.stringify(params)}`)
			// uni.navigateTo({
			// 	url: `/pages/page/webview/index?user_id=${this.owner_user_id}&returnUrl=${returnUrl}`
			// })
			uni.navigateTo({
				url: `/pages/getGuest/pushTeam?${qs.stringify(params)}`
			})
		},
		// 发圈素材
		toMaterialList(data, type) {
			const params = {
				case_article_id: type === 2 ? data.case_id : data.article_id,
				resource_type: type === 2 ? 2 : 1,
				relevance_id: type === 2 ? data.case_relevance_id : data.article_relevance_id,
				title: type === 2 ? data.case_name : data.title,
				imgUrl: type === 2 ? data.image_url : data.cover_img,
				extension_num: data.extension_num,
				huoke_num: data.huoke_num,
				cat_name: type === 2 ? '' : data.cat_name,
				from: 'index'
			}
			const returnUrl = encodeURIComponent(`${this.$constant.formal}/hkds/#/admin/guest/shareMaterial/list?${qs.stringify(params)}`)
			uni.navigateTo({
				url: `/pages/page/webview/index?user_id=${this.owner_user_id}&returnUrl=${returnUrl}`
			})
			// uni.navigateTo({
			// 	url: `/pages/getGuest/shareList?${qs.stringify(params)}`
			// })
		},
		// 选择地区
		selectAddr() {
			// this.areaSelData.isMask = true
			this.$refs.mpvueCityPicker.show()
		},
		/**
             * 获取装修报价地区名
             * @parmas val 地区选择插件的返回值
             */
		getSelCityName(val) {
			if (!this.$util.isEmpty(val) && !this.$util.isEmpty(val.label)) {
				let areaArr = val.label.split('-')
				this.areaSelData.cityName = areaArr[1]
				// this.areaSelData.isMask = false
				// this.$refs.mpvueCityPicker.hide()
				return false
			}
			let userRegions = uni.getStorageSync('userRegion')
			if (!userRegions) {
				return '厦门'
			}
			userRegions = JSON.parse(userRegions)
			if (userRegions && userRegions.city.name) {
				return userRegions.city.name
			}
			if (this.userInfo && this.userInfo.city_name) {
				return this.userInfo.city_name
			}
			return '厦门'
		},
		shareweixin() {
			let url = ''
			let title = ''
			let desc = ''
			const owner_user_id = this.userInfo.user_id
			const puser_id = this.share_user_id
			const imgurl = this.userInfo.user_picture
			const roleid = this.userInfo.role_id
			const userid = uni.getStorageSync('user_id')
			const links = this.$route.path

			if (userid == owner_user_id) {
				url = location.protocol + '//' + location.host + '/hkds/#' + links + '?owner_user_id=' + owner_user_id + '&share_user_id=' + owner_user_id
			} else {
				url = location.protocol + '//' + location.host + '/hkds/#' + links + '?owner_user_id=' + owner_user_id + '&share_user_id=' + userid + '&p_share_user_id=' + puser_id
			}
			if (roleid == 1) {
				title = this.userInfo.nick_name
				desc = '免费设计报价，风水测试，还有最新最全的装修案例，点进来就对了！'
			} else if (roleid == 2) {
				title = this.userInfo.nick_name
				desc = '单品爆款，硬软装材料，装修必备的产品，点进来就都有了！'
			} else if (roleid == 3) {
				title = this.userInfo.nick_name + '-设计师名片'
				desc = '收藏我的名片，马上获取免费设计！'
			} else if (roleid == 4) {
				title = this.userInfo.nick_name + '-项目经理名片'
				desc = '收藏我的名片，随时看最新的装修案例！'
			} else if (roleid == 5) {
				title = this.userInfo.nick_name + '名片'
				desc = '收藏我的名片，随时看最新的装修案例！'
			} else if (roleid == 6) {
				title = this.userInfo.nick_name + '家居顾问名片'
				desc = '收藏我的名片，随时看最内部的装修攻略！'
			} else {
				title = this.userInfo.nick_name
				desc = '收藏我的名片，随时看最内部的装修攻略！'
			}
			const obj = {
				title: title, // 分享标题
				desc: desc, // 分享内容
				linkurl: url, // 分享链接
				img: imgurl // 分享内容显示的图片
			}

			this.$wxshare.getJSSDK(url, obj, owner_user_id, puser_id)
		}
	},
	/**
     * 用户点击右上角分享
     */
	onShareAppMessage: function(options) {
		const shareObj = {
			title: this.userInfo.nick_name + this.userInfo.role_name,
			path: `/pages/design/designCompany/indexNew?owner_user_id=${this.userInfo.user_id}`
		}
		return shareObj
	}
}
</script>
<style lang="scss" scoped>
	#decorationNew {
		// 今日推荐
		.today_recommend_wrap {
			.van-tabs__wrap {
				z-index: 1;
			}

			.van-tabs__wrap::after {
				border: none;
			}

			.van-tab {
				flex: none;
				margin-right: 80px;
				padding: 0;
			}

			.van-tab--active {
				color: #333;
				font-size: 34px;
				font-weight: 600;
			}
		}
	}
</style>

<style lang="scss" scoped>

	#decorationNew {
		.search_wrap_body button[plain] {
			border: none;
		}

		padding-bottom: 140px;

		.wrap_common_sub {
			background-color: #fff;
		}

		.cooperation_wrap {
			.content_wrap {
				height: 390px;

				image {
					height: 100%;
				}
			}
		}

		.search_wrap {
			position: fixed;
			top: 0;
			width: 100%;
			max-width: 750px; /*no*/
			min-width: 320px; /*no*/
			z-index: 11;

			.search_wrap_body {
				position: relative;
				padding: 0 20px;

				.search_wrap_content {
					display: flex;
					align-items: center;
					color: #fff;
					padding-top: 20px;
					.search_wrap_phone {
						// width: calc(100% - 44px);
					}
				}

				.search_message {
					width: 40px;
					position: relative;
				}

				.search_message::before {
					content: '';
					position: absolute;
					right: 0;
					display: inline-block;
					width: 14px;
					height: 14px;
					background-color: $redColor;
					border-radius: 50%;
				}

				.search_wrap_input {
					font-size: 26px;
					height: 68px;
					// line-height: 68px;
					padding: 0 20px 0 24px;
					margin: 0 24px 0 12px;
					border-radius: 40px;
					color: $fontColor2;
					position: relative;
					background: hsla(0, 0%, 100%, 0.8);
					@include direction(center, space-between);
					flex: 1;

					i {
						font-size: 24px;
					}

					.search_wrap_input_left {
						@include disFlexCen;

						.search_wrap_separate {
							color: #ddd;
							margin: 0 26px;
						}

						.input_price_left {
							@include disFlexCen;

							span {
								display: block;
								max-width: 180px;
								margin-right: 8px;
							}

							i {
								margin-top: 2px;
							}
						}

						.input_price_right {
							color: $fontColor3;
							.iconfont {
								margin-right: 10px;
							}
						}

						span:first-child {
							margin-right: 8px;
						}
					}

					.search_wrap_input_right {
						color: $auxiliaryColor2;
						.iconfont {
							margin-left: 10px;
						}
					}
				}

				.icon-search {
					font-size: 40px;
					margin-right: 10px;
				}

				.search_mask {
					z-index: -1;
					background: linear-gradient(180deg, rgba(0, 0, 0, 0.2) 0, transparent);
					position: absolute;
					top: 0;
					right: 0;
					bottom: 0;
					left: 0;
				}
			}
		}

		.swipe_wrap {
			position: relative;
			.swiper {
			height: 370px;
			}
			.swipe_list {
				height: 370px;

				img {
					height: 100%;
					object-fit: cover;
				}
			}

			.swipe_label_wrap {
				@include direction(center, center);
				flex: 1;
				color: $fontColor2;
				padding: 24px 20px;
				background-color: #fff;

				& > div {
					width: 25%;
					@include direction(center, center);

					i {
						font-size: 32px;
						margin-right: 10px;
					}
				}
			}
		}

		.tab_wrap {
			margin-bottom: 50px;
			@include disFlexCen();
			align-items: flex-start !important;
			justify-content: space-between;

			.tab_list {

				span {
					color: $fontColor2;
					font-size: 28px !important;
				}

				button {
					width: 90px;
					padding: 0;
					line-height: 1;
					font-size: 28px;
					text-align: center;
					margin: 0 auto;
					border: 0 none;
					border-radius: 0;
				}

				.tab_img {
					width: 90px;
					height: 90px;
					margin: 0 auto;

					img {
						width: 100%;
						height: 100%;
					}
				}

				.otherDiv {
					// width: 20%;
					text-align: center;
					margin: 0 auto;
					/*margin-left: 3%;*/
					.tab_img {
						width: 90px;
						height: 90px;
						margin: 0 auto;
						margin-bottom: 16px;

						img {
							width: 100%;
							height: 100%;
						}
					}
				}

				.no-get-btn {
					label {
						line-height: 1.5;
					}
				}

				.otherimg {
					width: 90px;
					margin: 0 auto 10px !important;
				}
			}
		}

		.ad_wrap {
			.ad_list {
				@include disFlexCen();
				flex-wrap: wrap;

				button {
					padding: 0;
					line-height: 1;
					margin: 0 auto;
					border: 0 none !important;
					border-radius: 0;
				}

				.ad_img {
					width: calc(50% - 10px);
					margin-right: 10px;
					margin-bottom: 10px;
					border: 0 none;

					image {
						width: 100%;
					}
				}

				.ad_img:nth-child(2n) {
					margin-right: 0;
				}

				.ad_img:nth-child(2 + 1) {
					margin-bottom: 0;
				}
			}
		}

		.active_wrap {
			margin-top: 40px;
		}

		// 用户信息
		.user_wrap {
			color: $fontColor3;

			.user_wrap_top {
				@include disFlexCen();
				margin-bottom: 26px;
				flex: 1;

				.user_attr {
					width: 140px;
					height: 140px;
					padding: 11px;
					margin-right: 20px;
					border-radius: 16px;
					border: 0.5px solid $borderColorMain; /*no*/
					img {
						width: 100%;
						height: 100%;
						border-radius: 16px;
					}
				}

				.user_name_wrap {
					width: calc(100% - 160px);

					.user_name {
						font-size: 34px;
						font-weight: 600;
						color: #333;
						margin-bottom: 20px;
					}

					.star_wrap {
						@include disFlexCen();

						.star_list {
							@include disFlexCen();
							margin-right: 20px;

							image {
								width: 26px;
								height: 26px;
							}
						}
					}
				}
			}

			.user_wrap_bottom {
				& > p {
					margin-top: 10px;
				}
			}
		}

		// 今日推荐
		.today_recommend_wrap {
			padding: 20px 24px 10px !important;

			.recommend_wrap {
				// margin: 0 6px;
			}

			.update_com_content {
				border-radius: 20px;
				margin: 10px 0 40px;
				box-shadow: 0 10px 10px #eee;

				.update_con_img {
					width: 100%;
					height: 320px;

					img {
						height: 100%;
						border-top-left-radius: 20px;
						border-top-right-radius: 20px;
						object-fit: cover;
					}
				}

				.update_con_title {
					color: #333;
					font-size: 30px;
					font-weight: 600;
					margin-bottom: 20px;
				}

				.update_con_wrap {
					color: $fontColor3;
					padding: 20px 20px 1px 20px;

					& > div {
						margin-bottom: 20px;
					}

					.update_con_price {
						display: flex;
						align-items: center;
						justify-content: space-between;
					}

					.update_con_info {
						@include disFlexCen();
					}

					.case_share_info {
						color: $auxiliaryColor2;

						& > div {
							margin-right: 20px;
						}
					}

					.article_share_info {
						color: $fontColor3;
						justify-content: space-between;
					}
				}

				.update_com_btn {
					display: flex;
					align-items: center;
					justify-content: flex-end;
				}
			}

			.singOn-tag {
				color: #fff;
				padding: 2px 10px 4px;
				border-radius: 6px;
				background: linear-gradient(to right, #ff1c31, #f424de);
				position: relative;
				margin-left: 20px;
			}

			// .triangle {
			.singOn-tag::before {
				position: absolute;
				left: -10px;
				top: 9px;
				content: '';
				display: block;
				width: 0;
				height: 0;
				border-width: 10px 15px 10px 0;
				border-style: solid;
				border-color: transparent #ff1c31 transparent transparent; /*透明 灰 透明 透明 */
				// margin: 40px auto;
			}
		}

		.module_com_wrap {
			padding: 40px 30px 40px;
			border-top: 0.5px solid $borderColorMain;
			// margin: 20px 0;
			.title_wrap {
				font-size: 30px;
				font-weight: 600;
				padding-bottom: 10px;
				padding-top: 10px;
			}
		}

		.update_btn_com {
			display: flex;
			align-items: center;
			height: 56px;
			padding: 0 22px;
			font-size: 28px;
			color: $auxiliaryColor2;
			border-radius: 50px;
			border: 1px solid $auxiliaryColor2; /*no*/
			margin-left: 20px;
		}

		.share_btn {
			color: #fff;
			border-color: #ff7d6d;
			background: linear-gradient(90deg, #ff7d6d, #ff4444);
			font-size: 24px;
			padding: 0 30px;
			.iconfenxiang{
				font-size: 24px;
			}
			i {
				margin-right: 6px;
			}
		}

		.highlight_text {
			color: #ff9000;
		}

		img {
			display: block;
			width: 100%;
		}

		image {
			height: auto
		}
	}

	.getPhoneBtn {
		margin-left: 0 !important;
		margin-bottom: 11px !important;
	}
</style>
